<!DOCTYPE html>
<html>
<head>
  <meta charset='UTF-8'/>
  <link rel='stylesheet' href='../../dist/mapbox.css'/>
  <link rel='stylesheet' href='embed.css'/>
  <script src='../../dist/mapbox.js'></script>
  <script src='access_token.js'></script>
</head>
<body>
<style>
  .ui a {
    position:absolute;
    z-index:1000;
    top:80px;left:10px;
    background:#FFF;
    display:block;
    margin:0;padding:0;
    border:1px solid #BBB;
    min-width:138px;
    padding:10px;
    -webkit-border-radius:3px;
            border-radius:3px;
    }
</style>
<div id='map'>
<div class='ui'>
  <a id='zoom' href='#'>ease to zoom 12</a>
</div>
</div>
<script>
    var map = L.mapbox.map('map', 'tmcw.map-j5a868tu');
    document.getElementById('zoom').onclick = function(e) {
        e.preventDefault();
        e.stopPropagation();
        map.setZoom(12);
    };
</script>
</body>
</html>
